<template>
	<view class="fillPhone">
		<view class="fillBox">
			<input focus type="number" :value="nickName" @input="nicknameInt" />
		</view>
		<!-- 新建按钮 -->
		<view class="addBtnBox" :style="{paddingBottom:isIphoneX?'76rpx':''}">
			<view class="addAddressBtn" @tap="saveNickname">提交</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 手机机型
				modelmes:null,
				isIphoneX:false,
				info:null,
				nickName:'',
			};
		},
		onLoad() {
			// 判断机型iPhone X的
			this.modelmes = uni.getStorageSync('modelmes');
			if (this.modelmes.search('iPhone X') != -1) {
			   this.isIphoneX = true;
			}
			this.getInfo();
		},
		methods:{
			// 获取详情
			getInfo(){
				this.apiget('/fun/member/setting',{}).then(res =>{
					if(res.data.status == 200 ) {
						this.info = res.data.data;
						this.nickName = res.data.data.nickname
					}
				})
			},
			// 填写昵称
			nicknameInt(e){
				this.nickname = e.detail.value;
			},
			// 保存地址
			saveNickname(){
				if (this.nickName==''){
					uni.showToast({
						icon: 'none',
						duration:1000,
						title: '请输入昵称'
					});
					return false;
				}
				
				this.apipost('/fun/member/update-setting',{avatar:this.info.avatar,nickname:this.nickname}).then(res =>{
					if(res.data.status == 200 ) {
						uni.showToast({
							icon: 'success',
							duration:1000,
							title: '设置成功',
							success: res => {
								setTimeout(function (){
									uni.navigateBack({
									    delta: 1
									});
								}, 1000);
							},
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.fillPhone{
		min-height: 100%;
		background: #F8F8FA;
	}
	.fillBox{
		padding: 24rpx 32rpx;
		
		input{
			height: 100rpx;
			font-size: 28rpx;
			color: #333333;
			box-shadow: inset 0px -0.5px 0px #FF5238;
		}
	}
	.addBtnBox{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 8rpx 32rpx;
		line-height: 80rpx;
		background-color: #fff;
		
		.addAddressBtn{
			height: 80rpx;
			background: #FF5238;
			border-radius: 44rpx;
			font-size: 32rpx;
			color: #fff;
			text-align: center;
		}
	}
</style>
